<template>
	<view>
		<view class="title" v-show="show==1">
			<view class="cccc">
				<image class="img1" src="../../static/icons/tuoyuan.png" mode=""></image>
				<text>
					hi～
					你还没有登录呢
				</text>
			</view>


			<image class="img2" src="../../static/icons/shezhi.png" mode=""></image>
			<view class="order">
				<navigator url="/pages/mine/login/register">
					<button type="default">注册</button>
				</navigator>

				<navigator url="/pages/mine/login/login">
					<button type="default">登录</button>
				</navigator>



			</view>
		</view>

		<view class="title2" v-show="show==2">
			<view class="cccc2">
				<navigator url="/pages/mine/userCenter/index">
					<image class="img2" :src="list.avatar" mode="" style="border-radius: 50%;"></image>
				</navigator>

				<text>
					{{list.nickname}}
					用户名:{{list.username}}
				</text>
			</view>

		</view>

		<view class="big">
			<view class="on">

				<view class="on-1">
					<text>我的订单</text>
					<image src="../../static/icons/arr-r-1.png" mode=""></image>
				</view>
				<view class="kuai"> </view>

				<view class="on-2">
					<navigator url="myorder/myorder?type=0">
						<view>
							<image src="../../static/icons/icon-pay.png" mode=""></image>
							<text>待付款</text>
						</view>
					</navigator>
					
						<navigator url="myorder/myorder?type=1">
							<view>
								<image src="../../static/icons/icon-car.png" mode=""></image>
								<text>待收货</text>
							</view>
						</navigator>
					
					<navigator url="myorder/myorder?type=3">
						<view>
							
						
							<image src="../../static/icons/icon-done.png" mode=""></image>
							<text>已完成</text>
						</view>
					</navigator>
					
					<navigator url="myorder/myorder?type=9">
						<view>
							
							<image src="../../static/icons/icon-back.png" mode=""></image>
							<text>售后</text>
						</view>
					</navigator>
					

				</view>

			</view>


		</view>

		<view class="under">
			<view>
				<image src="../../static/icons/save.png" mode=""></image>
				<text>收藏</text>
			</view>
			<view>
				<image src="../../static/icons/brand.png" mode=""></image>
				<text>品牌</text>
			</view>
			<view>
				<image src="../../static/icons/article.png" mode=""></image>
				<text>文章</text>
			</view>
			<view>
				<navigator url="./address/address">
					<image src="../../static/icons/dizhi.png" mode=""></image>
					<text>地址</text>
				</navigator>



			</view>
			<view>
				<image src="../../static/icons/card.png" mode=""></image>
				<text>卡包</text>
			</view>

			<view>
				<navigator url="cart/cart">
					<image src="../../static/icons/cart2.png" mode=""></image>
					<text>购物车</text>
				</navigator>

			</view>
			<view>
				<image src="../../static/icons/kf.png" mode=""></image>
				<text>客服</text>
			</view>
			<view>

			</view>
			<view></view>
		</view>

	</view>
</template>

<script>
	import mixins from '@/mixins/index.js'
	export default {
		name: 'mine',
		mixins:[mixins],
		data() {

			return {
				list: [],
				show: ''
			};
		},
		methods: {

		},
		onShow() {
			
		},
		onLoad() {
			console.log(111)
			try {
				const value = uni.getStorageSync('storage_key');
				if (value) {
					this.list = value.data
					console.log(value);
					this.show = 2
				} else {
					this.show = 1
				}
			} catch (e) {

				// error
			}

		}
	}
</script>

<style lang="scss" scoped>
	page {
		background: #f1ece7;
	}

	.title {
		height: 300rpx;
		width: 100%;
		margin-top: 80rpx;

		.cccc {
			display: flex;
			justify-content: center;
		}

		.img1 {
			width: 150rpx;
			height: 150rpx;
			margin-left: 40px;
		}

		text {

			float: right;
			margin-right: 228rpx;
			margin-left: 70rpx;
			margin-top: 30rpx;

		}

		.img2 {
			width: 50rpx;
			height: 50rpx;
			float: right;
			margin-right: 10px;
			margin-top: -150rpx;
		}
	}

	.title2 {
		height: 220rpx;
		width: 100%;
		margin-top: 80rpx;

		.cccc2 {
			display: flex;
			justify-content: center;
		}

		.img2 {
			width: 150rpx;
			height: 150rpx;
			margin-left: -150rpx;
		}

		text {

			float: right;

			margin-left: 20rpx;
			margin-top: 30rpx;

		}


	}

	.order {
		display: flex;
		justify-content: center;


		button {
			width: 182rpx;
			height: 76rpx;
			border: 2px solid #3D4C46;
			margin: 0;

			margin-left: 44rpx;
			border-radius: 10px;
			text-align: center;
			line-height: 76rpx;

		}

		button:nth-child(2) {
			margin-left: 60rpx;
			color: #fff;
			background: #354e44;
		}
	}

	.big {

		width: 670rpx;
		margin: 0 auto;

		height: 208rpx;

		.on {
			background: #fff;
			height: 208rpx;
			border-radius: 10rpx;

			.on-1 {
				height: 72rpx;

				text {
					margin-left: 56rpx;
					line-height: 72rpx;
					font-size: 26rpx;
					color: #3E3E3E;
					letter-spacing: 1.86rpx;
				}

				image {
					height: 26rpx;
					width: 16rpx;
					float: right;
					margin-top: 25rpx;
					margin-right: 57rpx
				}
			}
		}

		.kuai {
			width: 584rpx;
			height: 2rpx;
			background: black;
			margin-left: 52rpx;
			opacity: 0.2;
		}

		.on-2 {
			display: flex;
			margin-top: 30rpx;
			justify-content: space-evenly;

			view {
				text-align: center;

				image {
					display: block;
					width: 45rpx;
					margin: 0 auto;
					height: 42rpx;
				}

				text {

					font-size: 26rpx;
					color: #3E3E3E;
					letter-spacing: 1.86rpx;
				}

			}


		}

	}

	.under {
		display: flex;
		margin: 0 auto;
		margin-top: 70rpx;
		background: #FFFFFF;
		justify-content: space-evenly;
		flex-wrap: wrap;
		height: 600rpx;
		width: 670rpx;

		view {
			margin-top: 50rpx;
			height: 150rpx;
			width: 33%;
			// border-right:1px  solid #D5D5D5  ;
			text-align: center;
			overflow: hidden;

			image {

				display: block;
				margin: 0 auto;
				width: 54rpx;
				height: 54rpx;

			}

			text {
				font-size: 26rpx;
				color: #3E3E3E;
				letter-spacing: 1.86rpx;
			}
		}
	}
</style>
